<template>
	<!-- 页面全局配置 -->
	<view class="pageconfig">
		<view v-if="activity&&activity.cover&&activity.cover.path" class="flex1   response  flex  justify-center  "
			style="flex-direction: row;align-items: center;">
			<image mode="widthFix" class="picture2  " :src="activity.cover.path"></image>
		</view>
		<view class="flex3   response  flex  justify-start  " style="flex-direction: column;">
			<view class="flex4   response  flex  justify-start  " style="flex-direction: column;">
				<text class="text5 ">{{activity.title}}</text>
				<view class="flex6   response  flex  justify-start  " style="flex-direction: column;">
					<text class="text7 ">
						{{activity.content}}</text>
					<view class="flex8   response  flex flex-wrap justify-center  "
						style="flex-direction: row-reverse;align-items: center;">
						<text class="text9 text-grey text-sm ">
							{{timestampToDateString(activity.create_date)}}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	import Vue from 'vue'
	const db = uniCloud.database()
	let abu_activity_db = db.collection('activity-record');
	export default {
		data() {
			return {
				id: '',
				activity: {},
				user_info: {},
				picsrc2: "https://via.placeholder.com/400x200.png/3c9cff/fff",
			};
		},
		mounted() {
			this.user_info = uniCloud.getCurrentUserInfo()
			console.log(this.user_info);
		},
		onLoad(e) {
			if (e) {
				this.id = e.id || '6602ae8021821b6d2b9ac8bf'
			}
			abu_activity_db.where({
				_id: this.id
			}).get({
				getOne: true
			}).then(res => {
				const activity_data = res.result.data;
				console.log(activity_data);
				this.activity = activity_data;
			})
		},
		methods: {
			timestampToDateString(timestamp) {
				var date = new Date(timestamp);
				// 使用 Date 对象的方法获取年、月、日等信息
				var year = date.getFullYear();
				var month = date.getMonth() + 1; // 月份是从 0 开始的，所以需要加 1
				var day = date.getDate();
				// 将其格式化为想要的字符串格式
				var dateString = year + '-' + (month < 10 ? '0' : '') + month + '-' + (day < 10 ? '0' : '') + day;
				return dateString;
			}
		}
	}
</script>

<style lang="less">
	/**
 *
 此处必须引用colorui样式,并放入根目录，css样式可以这样写
	@import "colorui/main.css";
	@import "colorui/icon.css";

 如需要引用colorui到全局，
 需要在App.vue 引入
 	@import "colorui/main.css";
	@import "colorui/icon.css";
 *
 */




	/**本页全局配置的代码**/
	.pageconfig {
		width: 100%;
		overflow: hidden;
		overflow-y: scroll;
		height: 100vh;
	}



	/**pagedomcss**/


	.flex1 {
		width: 100%;
	}

	.picture2 {
		overflow: hidden;
	}

	.flex3 {
		width: 100%;
		width: calc(100% - 40rpx);
		margin-top: 20rpx;
		margin-bottom: 20rpx;
		margin-left: 20rpx;
		margin-right: 20rpx;
	}

	.flex4 {
		width: 100%;
		margin-top: 40rpx;
	}

	.text5 {
		font-weight: 900;
	}

	.flex6 {
		width: 100%;
	}

	.text7 {
		margin-top: 20rpx;
		margin-bottom: 20rpx;
	}

	.flex8 {
		width: 100%;
		position: relative;
		padding-top: 10rpx;
		padding-bottom: 10rpx;
		padding-left: 10rpx;
		padding-right: 10rpx;
	}

	.text9 {
		font-weight: 100;
	}

	.onebutton10 {
		width: 100%;
		margin-top: 40rpx;
	}
</style>